<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet"
          href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"
          integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu"
          crossorigin="anonymous">
    <script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>

    <style>
        .w-e-menu {
            z-index: 2 !important;
        }
        .w-e-text-container {
            z-index: 1 !important;
        }
        .news_title{
            padding-top: 21px;
            padding-bottom: 21px;
            margin-bottom: 21px;
            text-align: left;
            border-bottom: 1px solid #c6c6c6;
        }
        .title-content{text-align: left;}
        .title-tag{
            display: inline-block;
            text-align: left;
            color: #777;
            font-size: 14px;
            line-height: 1.5;
        }
        .title-tag i{margin-right: 7px;}
        .field-body{
            overflow-y: auto;
            overflow-y: hidden;
            line-height: 1.5;
        }
        .field-body p{
            background: rgb(255, 255, 255);
            margin: 0pt;
            text-align: justify;
            line-height: 150%;
            text-indent: 24pt;
            font-size: 12px;
            color: #333;
            font-family: 微软雅黑;
        }
    </style>

</head>
<body>

<div id="app" class="demo-input-size">

    <div class="block">
        <div class="news_title">
            <h1><span v-html="newsInfo.title">{{ newsInfo.title }}</span></h1>
            <div class="title-content">
                <div class="title-tag">
                    <i class="el-icon-time"></i>
                    <span v-html="newsInfo.publicDate.substring(0, 10)">
                        {{ newsInfo.publicDate.substring(0, 10) }}
                    </span>
                </div>
            </div>
        </div>
    </div>
    <!-- 正文 -->
    <div class="block" class="field-body" v-html="newsInfo.details">
        {{ newsInfo.details }}
    </div>
</div>

<script>

    $.get("/demo/column/newsListNewsColumn", function (backData) {
        haha.columnArr = backData.data;
    });

    var id = window.location.href.split("=")[1];
    $.get("/demo/news/updateQueryNews/" + id, function (backData) {
        haha.newsInfo = backData.data;
    });

    var haha = new Vue({
        el:"#app",
        data:{
            columnArr:[],
            newsArr:[],
            newsInfo:{},
        },
        methods:{}
    });

</script>

</body>
</html>